	<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8" />
	<title></title>
	<!-- 引入样式 -->
	<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
	<style>
		body,html{
			margin: 0;
			height: 100%;
			overflow: hidden;
		}
		#app{
			min-height: 100%;
		}
		.el-header{
			position: fixed;
		    top: 0;
		    left: 0;
		    right: 0;
		    background: #fff;
		    z-index: 9999;
			box-shadow: 4px 4px 8px rgba(0,0,0,0.15);
		}
		.el-header .el-input input{
			background: #edf1f2;
			border-radius: 30px;
		}
		.el-main {
		    padding: 80px 20px 20px 20px;
		    min-height: 100%;
		    height: auto;
		    overflow: hidden;
		}
	</style>
</head>
<body>
	<div id="app">
		<header class="el-header is-justify-space-between el-row--flex">
			<el-col :span="5" style="padding-top: 15px;">
				<el-input placeholder="任务、动态关键词" suffix-icon="el-icon-search" size="small"></el-input>
			</el-col>
			<el-col :span="19">
				<el-menu  class="el-menu-demo" mode="horizontal"  style="float: right;border: 0;">
			  		<el-menu-item index="1"><i class="el-icon-message"></i></el-menu-item>
				  	<el-menu-item index="2"><i class="el-icon-menu"></i></el-menu-item>
				  	<el-menu-item index="3">
				  		<el-dropdown @command="changeIframeUrl">
						  	<el-button type="primary" size="mini" round>
						    	<i class="el-icon-plus" style="color:#fff;font-size: 14px;"></i>新建任务
						  	</el-button>
						  	<el-dropdown-menu slot="dropdown">
						    	<el-dropdown-item command="拜访沟通">拜访沟通</el-dropdown-item>
						    	<el-dropdown-item command="运营">运营</el-dropdown-item>
						    	<el-dropdown-item command="产品设计">产品设计</el-dropdown-item>
						    	<el-dropdown-item command="开发测试">开发测试</el-dropdown-item>
						    	<el-dropdown-item command="其他">其他</el-dropdown-item>
						  	</el-dropdown-menu>
						</el-dropdown>
				  	</el-menu-item>
				</el-menu>
			</el-col>
		</header>
		<div class="el-main" style="height: 100%;">
			<iframe id="mainframe" name="mainframe" :src="iframeUrl" frameborder="false" scrolling="auto" style="overflow-x: hidden; border: none; width: 100%;" height="100%" allowtransparency="true" v-on:load="changeFrameHeight">
				
			</iframe>
	      	
	    </div>
	</div>
	<!-- 先引入 Vue -->
  	<script src="https://unpkg.com/vue/dist/vue.js"></script>
	<!-- 引入组件库 -->
	<script src="https://unpkg.com/element-ui/lib/index.js"></script>
	<script>
//		window.onload = function(){
//			sessionStorage.setItem("iframeUrl", 'detail.html');
//		}
		function changeFrameHeight(){
		    var ifm= document.getElementById("mainframe"); 
		    ifm.height=document.documentElement.clientHeight - 100;
		    
		}
		window.onresize=function(){  
		     changeFrameHeight();  
		}
		var app = new Vue({
		  el: '#app',
		  data: function() {
		    return { 
		    	activeName: 'first',
		    	iframeUrl:'detail.html',
		    }
		  },
		  	methods:{
		  		changeFrameHeight:function(){
		  			changeFrameHeight(); 
		  		},
		  	changeIframeUrl:function(command){
		  		document.getElementById("mainframe").setAttribute('src','new_task.html')
//		  		debugger;
//		  		sessionStorage.setItem("iframeUrl", 'new_task.html');
//		  		this.iframeUrl = sessionStorage.getItem("iframeUrl");
		  		sessionStorage.setItem("taskName", command);
//		  		app.iframeUrl = 'new_task.html';
		  		
		  	}
		  }
	  })

  	</script>
	</body>
</html>
